<style>
	/* 筛选 */
	.uni-list{
		padding: 20upx;
	}
	.uni-list-cell{ 
		margin-bottom: 30upx;
	}
	.uni-list-cell .g-input{
		display: flex;
		align-items: center;
		flex-wrap: wrap;
	}
	.uni-list-cell .g-input input{
		flex: 1;
		border: 1px solid #cccccc;
		text-align: center;
		border-radius: 10upx;
		padding: 7upx 0;
		font-size: 32upx;
	}
	.uni-list-cell .g-input .line{
		width: 3%;
		height: 2px;
		background: #000000;
		margin: 0 20upx;
	}
	.uni-list-cell .text{
		padding: 15upx 0;
		font-size: 32upx;
	}
	.uni-common-button{
		position: absolute;
		bottom: 0;
		width: 100%;
		left: 0upx;
		text-align: center;
		background: #000000;
		color: #ffffff;
		font-size: 32upx;
		display: flex;
		align-items: center;
	}
	.uni-common-button .common-button{
		flex: 1;
		padding: 30upx 0;
	}
	.uni-common-button .sure{
		background: #D71511;
	}
	.uni-list-cell .g-input button{
		border: 1px solid #cccccc;
		padding: 7upx 25upx;
		margin-right: 30upx;
		margin-bottom: 10upx;
		border-radius: 10upx;
		color: #999999;
		font-size: 32upx;
			
	}
	.uni-list-cell .g-input .on{
		color: #ffffff !important;
		background-color: #d71311 !important;
		border-color: #d71311 !important;
	}
    /* 产品 */
    .g-product-list {
        padding: 10px;
    }

    .g-product {
        border-radius: 3px;
        margin-bottom: 10px;
		box-shadow: 0 0 5px rgba(0, 0, 0, .2);
        display: flex;
        padding: 10px;
        position: relative;
    }

    .g-product-pic {
        width: 240upx;
        height: 240upx;
        overflow: hidden;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-right: 10px;
    }
	.g-product-pic image{
		width: 240upx;
		height: 240upx;
		overflow: hidden;
	}

    .g-product-info {
        flex: 1;
        position: relative;
    }

    .g-price {
        font-size: 26upx;
        margin-bottom: 5px;
		display: flex;
		align-items: center;
		justify-content: space-between;
    }

    .g-price text.red {
		color: #d71311;
        font-size: 40upx;
    }

    .small-text {
        color: #828080;
    }

    .u-product-buy {
        color: #D71511;
        border-radius: 8upx;
        padding: 4upx 14upx;
        font-size: 28upx;
        display: inline-block;
		border: 1px solid #D71511;
		margin-right: 20upx;
    }
    .u-product-sign {
        width: 75upx;
		height: 75upx;
		overflow: hidden;
        position: absolute;
        top: 5px;
        left: 5px;
    }

    .u-product-name {
		height: 82upx;
		line-height: 41upx;
    }
    .u-order {
        font-size: 24upx;
        color: #D71511;
        border: 1px solid #D71511;
        border-radius: 2px;
        padding: 0 2px;
		margin-right: 8upx;
    }
	.m-full-loading image{
		width: 140upx;
		height: 140upx;
	}
    /* 弹框 */
    .u-popup-mask {
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        background: rgba(0, 0, 0, .5);
        z-index: 9;
    }

    .g-popup {
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 10;
        border-radius: 5px;
        background: #fff;
        text-align: center;
        width: 80%;
    }

    .u-popup-title {
        padding: 15px 0;
        box-shadow: 0 0 10px rgba(0, 0, 0, .5);
        font-size: 32upx;
    }
	.u-popup-cont {
		padding-top: 40upx;
		font-size: 36upx;
		text-align: center;
	}
    .u-popup-close {
        position: absolute;
        top: 10px;
        right: 10px;
    }

    .u-popup-buy {
        color: #fff;
        background: #d71311;
        border-radius: 4px;
        width: 40%;
        padding: 10px 0;
		margin: 60upx auto;
        box-shadow: 0 7px 13px -2px rgba(255,0,0,.5);
    }
	.u-product-status {
	    width: 118upx;
		height: 99upx;
	    position: absolute;
	    right: 10px;
	    top: 80upx;
	}
	.u-to-top {
	    position: fixed;
	    right: 10px;
	    bottom: 60px;
	    width: 100upx;
	    height: 100upx;
		z-index: 99;
	}
</style>

<template>
    <view class="page">
       
        <view class="g-product-list">
            <view class="g-product" v-for="(item, index) in data" :key="index" v-if="isGoodsTpye">
                <view class="g-product-info">
					<view class="u-product-name f-two-ellipsis">
						{{item.order_info.goods_name}}
					</view>
                    <view class="small-text">订单号&nbsp;&nbsp;{{item.order_no}}</view>
					<view class="small-text">津贴&nbsp;&nbsp;{{item.money}}</view>
					<view class="small-text">发放日期&nbsp;&nbsp;{{item.finish_time}}</view>
					<button class="u-product-buy" @tap="handle(item.id)" v-if="item.status == 1">委托代售</button>
					<button class="u-product-buy" @tap="open" v-if="item.status == 1" :data-id="item.id">发货</button>
					<image v-if="item.status_ico == 0" class="u-product-status" src="../../static/icons/user/pawn_issued.png" mode="widthFix">
						<!-- 待发放 -->
					</image>
					<image v-if="item.status_ico == 1" class="u-product-status " src="../../static/icons/user/pawn_grant.png" mode="widthFix">
						<!-- 已发放 -->
					</image>
					<image v-if="item.status_ico == 2" class="u-product-status " src="../../static/icons/user/finish.png" mode="widthFix">
						<!-- 已完成 代售-->
					</image>
					<image v-if="item.status_ico == 3" class="u-product-status" src="../../static/icons/user/sending.png" mode="widthFix">
						<!-- 待发货 -->
					</image>
					<image v-if="item.status_ico == 4" class="u-product-status" src="../../static/icons/user/sended.png" mode="widthFix">
						<!-- 已发货 -->
					</image>
                </view>
            </view>
        </view>
		<!-- 弹框蒙版 -->
		<view class="u-popup-mask" v-if="bPopup" @touchmove.stop=""></view>
		<view class="g-popup" v-if="bPopup" @touchmove.stop="">
		    <view class="u-popup-title">提示</view>
		    <view class="u-popup-cont">委托代售</view>
			<button class="u-popup-buy" @tap="toPay">确认</button>
		    <view class="u-popup-close" @tap="closePopup">
		        <close size="50" color="#847c7c"></close>
		    </view>
		</view>
        <view class="m-no-data" v-if="showNodata">
            <image src="../../static/images/no_order.png" mode="widthFix"></image>
        </view>
		<view class="m-full-loading" v-if="showloading">
		    <image src="../../static/images/loading.gif"></image>
		</view>
		<!-- 筛选 -->
		<uni-drawer :visible="showRigth" mode="right" @close="closeDrawer">
			<view class="uni-list">
				<!-- <view class="uni-list-cell">
					<view class="text">价格区间：</view>
					<view class="g-input">
						<input type="number" v-model="shop_price1" placeholder="最低价"><text class="line"></text>
						<input type="number" v-model="shop_price2" placeholder="最高价">
					</view>
				</view> -->
				<view class="uni-list-cell">
					<view class="text">状态：</view>
					<view class="g-input">
						<button  @tap="getStatusType('')" :class="calssStatus === '' ? 'on':''">全部</button>
						 
						<button v-for="(item,index) in term_status" :key="index" @tap="getStatusType(index)"
						 :class="calssStatus === index ? 'on':''">{{item}}</button>
					</view>
				</view>
				<view class="uni-list-cell">
					<view class="text">按类型排序：</view>
					<view class="g-input">
						<button v-for="(item,index) in classList" :key="index" @tap="getClassType(index)"
						 :class="classTpye == index ? 'on':''">{{item}}</button>
					</view>
				</view>
				<view class="uni-list-cell">
					<view class="text">排序：</view>
					<view class="g-input">
						<button @tap="getClassType('desc')" :class="classText == 'desc' ? 'on':''">由大到小</button>
						<button @tap="getClassType('asc')" :class="classText == 'asc' ? 'on':''">由小到大</button>
					</view>
				</view>
			</view>
			<view class="uni-common-button">
				<view class="common-button" @tap="reset">重置</view>
				<view class="common-button sure" @tap="confirm">确认</view>
			</view>
		</uni-drawer>
		<image class="u-to-top" src="../../static/images/pawn_search.png" mode="widthFix"  @tap="search"></image>
    </view>
</template>

<script>
    import henglang from '../../common/common.js';
    export default {
        data() {
            return {
                data: [], // 商品列表数据
                sendData: {  // 请求商品列表发送的数据
                    page: 1,
					shop_price1: '',
					shop_price2: '',
					sort: '',
					order: '',
					status:''
                },
				
				totalPages:1,//总页数
                showloading: false,
                showNodata: false,
				showRigth: false,
				shop_price1: '',
				shop_price2: '',
				classList:['津贴','日期'],
				classTpye:'-1',
				classText:'desc',
				order: '',
				ssort:'',
				term_status:[],
				calssStatus:'',
				allowance_id:'0',
				
				isGoodsTpye: henglang.isGoodsTpye(),
				idx: 0,
				team_id:0,
				isResult: false,
				bPopup: false,
				weiNum:'',
				weiList:{
					team_id:'',
					id:''
				}
            };
        },
		methods: {
            back() {
                uni.navigateTo({
                	url:'/pages/user/user_index'
                })
            },
			getStatusType(e){
				this.calssStatus=e;
			},
			getClassType(e){
				switch (e){
					case 0:
						if(this.classTpye==0){
							this.classTpye = '-1';
							this.ssort = ''
						}else{
							this.classTpye = e;
							this.ssort = 'money'
						}
						
						break;
					case 1:
						if(this.classTpye==1){
							this.classTpye = '-1';
							this.ssort = ''
						}else{
							this.classTpye = e;
							this.ssort = 'finish_time'
						}
						break;
					case 'desc':
						this.classText = this.order = 'desc';
						break;
					case 'asc':
						this.classText = this.order = 'asc';
						break;
					default:
						break;
				}
			},
            open(e) { // 打开弹框
                let id = e.currentTarget.dataset.id;
				uni.navigateTo({
					url:'/pages/pawn/shipment?allowance_id=' + id
				})
            },
			getList(){
				this.sendData = {
					page: this.page,
					shop_price1: this.shop_price1,
					shop_price2: this.shop_price2,
					sort: this.ssort,
					order: this.order,
					status:this.calssStatus
				}
				this.request()
			},
			reset() {
				this.shop_price1 = '';
				this.shop_price2 = '';
				this.order = '',
				this.ssort = '',
				this.classText = 'desc';
				this.classTpye = '-1';
				this.calssStatus=''
			},
			search(){
				this.showRigth = true;
			},
			closePopup() {
				this.bPopup = !this.bPopup;
			},
			closeDrawer() {
				this.showRigth = false;
			},
			toPay() {
				let that = this
				that.showloading = true
				let sendData={
					id:that.allowance_id,
					action:2,
				}
				henglang.post('Custom_allowance/collarAllowance',sendData,true,function(res){
					that.showloading = false
					that.bPopup = false
					if(res.data.code == 0){
						henglang.showToast(res.data.msg,500)
						that.page=1;
						that.getList()
					}else{
						henglang.showToast(res.data.msg)
					}
				});		
			},
			returnGoods(team_id){
				let that = this
				that.data.forEach((item,index)=>{
					if (item.team_id == team_id) {
						that.weiList.team_id = team_id
						that.weiList.id = 0
					}
				})	
				uni.showModal({
					title: '退货',
					content: '确认退货？',
					success: function (res) {
						if (res.confirm) {
							that.toPay();
						}
					}
				})
			},
            handle(id) {
				this.bPopup = true
				this.allowance_id=id;
			},
            request(type) { // 请求数据
				let that = this;
				that.showloading = true;
				if(!henglang.checkLogin()){
					that.showloading = false;
					that.showNodata = true;
					return false;
				}
				let url = '';
				let data = {};
				if(that.isGoodsTpye){
					url = 'Custom_allowance/getAllowance'
					data = that.sendData
				}else{
					url = 'order/demiorder'
					data = {type:2}
				}
				if(that.sendData.page <= that.totalPages){
					henglang.get(url,data,true,function(res){
						that.showloading = false;
						if (!res.data.data.length) {
							that.showNodata = true;
							return false;
						}
						if (type == 'plus') {
							that.data = that.data.concat(res.data.data);
						} else {
							that.data = res.data.data;
							that.totalPages = res.data.total_pages;
							that.term_status=res.data.term_status
						}
					});			
				}else{
					that.showloading = false;
				}
            },
            confirm() {
            	this.page = 1;
            	if(Number(this.shop_price1) > Number(this.shop_price2)){
            		henglang.showToast('请输入正确的价格范围',1000)
            	}else{
            		this.shop_price1 = this.shop_price1;
            		this.shop_price2 = this.shop_price2;
            		this.getList();
            		this.showRigth = false;
            	}
            	
            },
        },
		onLoad({isResult,team_id}) {
			this.request();
		},
        onReachBottom() {
			this.sendData.page += 1;
            this.request('plus');
        },
		onBackPress(options) {  
		    if (options.from === 'navigateBack') {  
		        return false;  
		    }  
		    this.back();  
		    return true;  
		}
    }
</script>
